<template>
    <div>
        <!-- <el-tabs v-model="type" type="card" @tab-click="handleClick">
            <el-tab-pane label="全部公告" name="0" />
            <el-tab-pane label="我发布的" name="1" />
        </el-tabs> -->
        <el-table :data="noticeList" style="width: 100%">
            <el-table-column prop="id" label="ID" width="120" />
            <el-table-column prop="sender" label="发件人" width="180" />
            <!-- <el-table-column prop="title" label="公告标题" width="180" /> -->
            <!-- <el-table-column label="公告内容">
                <template slot-scope="scope">
                    <p class="line_1">{{ scope.row.conents }}</p>
                </template>
            </el-table-column>
            <el-table-column label="公告类型">
                <template slot-scope="scope">
                    <p class="line_1" :style="{color: scope.row.type ? '#5cb87a' : '#409eff'}">{{ scope.row.type ? '教师公告' : '系统公告' }}</p>
                </template>
            </el-table-column> -->
            <el-table-column prop="releaseTime" label="发布时间" width="180" />
            <el-table-column label="操作" width="180">
                <template slot-scope="scope">
                    <el-link type="primary" :disabled="scope.row.annex.length === 0" @click="download(scope.row.annex)" class="link">查看附件</el-link>
                    <el-link type="danger" :disabled="getDelRoot(scope.row)" @click="del(scope.row.id)">删除公告</el-link>
                </template>
            </el-table-column>
        </el-table>
        <div class="page">
            <el-pagination background layout="prev, pager, next" :total="noticeTotal" :current-page="page+1" :page-size="pagesize" @current-change="cheangePage"/>
        </div>
    </div>
</template>

<script>
import { mapState, mapActions } from 'vuex';
export default {
    // name: 'WebfileList',
    name: 'Studentfile',
    data() {
        return {
            page: 0,        // 页码
            pagesize: 12,   // 单页数据量
            type: 0,        // 0-全部 1-我发布的
            userInfo: {},   // 用户信息
        };
    },
    computed: {
        ...mapState('Notice', ['noticeList', 'noticeTotal']),
        getDelRoot(){
            return (notice) => {
                if (this.userInfo.role) {
                    return !(notice.type == 1 && notice.sender == this.userInfo.id);
                } else return false;
            }
        }
    },
    methods: {
        ...mapActions('Notice', ['getFileList','delNotice']),
        getData() {
            let { type, page, pagesize, userInfo } = this;
            let { id, role } = userInfo;
            this.getFileList({ type, id, role, page, pagesize });
        },
        handleClick(e){
            this.page = 0;
            this.getData();
        },
        download(url){
            window.open(url);
        },
        cheangePage(page){
            this.page = --page;
            this.getData();
        },
        del(notice_id){
            let { type, page, pagesize, userInfo } = this;
            let { id, role } = userInfo;
            this.delNotice({ notice_id,type, id, role, page, pagesize })
        }
    },
    mounted() {
        this.userInfo = this.$cookies.get('userInfo');
        this.getData();
    },
};
</script>

<style lang="less" scoped>
    @import "asle/index.less";
    .link {
        .mar_r(10px);
    }
    .page {
        .pos_f();
        .pos_rb(20px,20px);
    }
</style>